<template>
  <div>
    <el-cascader size="large" placeholder="请选择区域" v-model="value" :props="props" :options="regionData"
      @change="handleChange" />
  </div>
</template>

<script lang='ts' setup>
import { ref } from 'vue'

import {
  regionData,
} from 'element-china-area-data';

const value = ref([])

const props = {
  value: 'label'
}

const handleChange = (record, e) => {
  console.log(8899, record)
  emit('update:province', record[0])
  emit('update:city', record[1])
  emit('update:county', record[2])
}

const emit = defineEmits(['update:province', 'update:city', 'update:county'])
</script>

<style lang='scss' scoped></style>
